<!DOCTYPE html>
<html>
<head>
	<meta charset='utf-8'>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<title>个人中心</title>
	<link rel='stylesheet' type='text/css' href='css/common.css'>
	<link rel='stylesheet' type='text/css' href='css/perCenter.css'>
</head>
<body>
<!-- 导航条开始 -->
	<div class='navbar nav-fixed'>
			<ul>
				<li><a href="#">返回论坛</a></li>
				<li><a href="#">资源下载</a></li>
				<li><a href="#">天空</a></li>
				<li><a href="#">历史介绍</a></li>
				<li><a href="#">校园助手</a></li>
				<li><a href="#">娱乐</a></li>
				<li><a href="#">华农百科</a></li>
			</ul>
			<ul class='float-right'>
				<li class='active'>
					<a href="#">下载红满堂客户端</a>
					<div class='load'>
						<img class='load-top' src="img/nav-logo.png">
						<img src="img/nav-code.png">
						<a class='load-link' href="#"></a>
						<a class='load-link load-link-bottom' href="#"></a>
					</div>
				</li>
				<li><a href="#">提醒</a></li>
				<li><a href="sign.html">登录</a></li>
			</ul>
	</div>
<!-- 导航条结束 -->
<!-- 导航开始 -->
	<div class='nav-bg'>
		<div class='nav-box'>
			<div class='logo'></div>
			<ul class='nav'>
				<li><a href="index.html">首页</a></li><li><a href="search.html">所有商品</a></li><li><a href="release.html">发布商品</a></li><li><a href="help.html">用户帮助</a></li>
			</ul>
			<div class='search'>
				<input type='text'><button>搜索</button>
			</div>
		</div>
	</div>
	<div class='nav-border'></div>
<!-- 导航结束 -->

<!-- 公告信息开始 -->
	<div class='container'>
		<div class='side-nav'>
			<div class='tab'>个人中心</div>
			<div class='border'></div>
			<ul><li class='active'>个人资料</li><li>我的商品</li><li>交易记录</li><li>我的收藏</li><li id='quit'>退出系统</li></ul>
		</div>
		<div class='section'>
			<div class='tab'>个人资料</div>
			<div class='border'></div>
			<form>
				<div class='name'>
				<label>用户名：</label>
					<input type='text'>
				</div>
				<div class='image'>
					<label>头像：</label>
					<img src="img/ava.png">
					<p>仅支持JPG、GIF、PNG格式，且文件小于5M</p>
				</div>
				<button class='save-btn'>保存</button>
			</form>
		</div>
		<div class='section hide'>
			<div class='tab'>交易记录</div>
			<div class='border'></div>
			<div class='detail'>
				<img src="img/ava.png">
				<p>这个是商品名称</p>
				<div class='btn-group'>
					<a>详细</a>
					<a>删除</a>
				</div>
				<p class='date'>发布时间：2015年1月1日</p>
			</div>
		</div>
		<div class='section hide'>
			<div class='tab'>我的商品</div>
			<div class='border'></div>
			<div class='detail'>
				<img src="img/ava.png">
				<p>这个是商品名称</p>
				<div class='btn-group'>
					<a>详细</a>
					<a>删除</a>
				</div>
				<p class='date'>发布时间：2015年1月1日</p>
			</div>
			<div class='detail'>
				<img src="img/ava.png">
				<p>这个是商品名称</p>
				<div class='btn-group'>
					<a>详细</a>
					<a>删除</a>
				</div>
				<p class='date'>发布时间：2015年1月1日</p>
			</div>
		</div>
		<div class='section hide'>
			<div class='tab'>我的收藏</div>
			<div class='border'></div>
			<div class='detail'>
				<img src="img/ava.png">
				<p>这个是商品名称</p>
				<div class='btn-group'>
					<a>详细</a>
					<a>删除</a>
				</div>
				<p class='date'>发布时间：2015年1月1日</p>
			</div>
			<div class='detail'>
				<img src="img/ava.png">
				<p>这个是商品名称</p>
				<div class='btn-group'>
					<a>详细</a>
					<a>删除</a>
				</div>
				<p class='date'>发布时间：2015年1月1日</p>
			</div>
		</div>
		<div class='section hide exita'>
			<div class='tab'></div>
			<div class='border'></div>
			<div class='prompt'>
				<span id='close-btn'></span>
				<p>确定退出系统？</p>
				<div class='btn-group'>
					<button id='cancle'>取消</button>
					<button id='sure'>确定</button>
				</div>
			</div>
		</div>
	</div>
	<div class='mask hide'></div>
<!-- 公告信息结束 -->

<!--页尾-->
	<div class="footer">
		<img class="color" src="img/footer.png" />
		<div class="link-div">	
			<div class="footer1">
				<a href="#" class="footer-a">红满堂论坛</a>
				<a href="#">华南农业大学首页</a>
				<a href="#">华南农业大学教务处</a>
				<a href="#">华南农业大学论坛</a>
				<a href="#">华南农业大学论坛</a>
			</div>

			<div class="footer2">
				<a href="#">使用须知</a>
				<a href="#">用户必看</a>
				<a href="#">免责声明</a>
				<a href="#">建议投诉</a>
			</div>

			<div class="footer2">
				<p class="footer-p">联系我们</p>
				<p>QQ:<span>123456</span></p>
				<p class="footer-p3">邮箱：<span>84908079800</span></p>
			</div>

			<div class="footer3">
				<p>客户端下载</p>
				<a href="#"><img src="img/footer-code.png"/></a>
				<div>
					<a href="#"><img src="img/load3.png"/></a>
					<a href="#"><img src="img/load4.png"/></a>
				</div>
			</div>
		</div>

		<div class="footer4">
			<img src="img/footer-line.png"></img>
			<div>
				<p>Powered by 红满堂工作室</p>
			</div>
			<img src="img/footer-line.png"></img>
		<div>
	</div>

<script type="text/javascript" src='js/jquery-2.1.1.min.js'></script>
<script type="text/javascript" src='js/perCenter.js'></script>
</body>
</html>